<style>
.avatar-uploader .el-upload {
  border: 1px dashed #d9d9d9;
  border-radius: 6px;
  cursor: pointer;
  position: relative;
  overflow: hidden;
}

.avatar-uploader .el-upload:hover {
  border-color: #409EFF;
}

.avatar-uploader-icon {
  font-size: 28px;
  color: #8c939d;
  width: 178px;
  height: 178px;
  line-height: 178px;
  text-align: center;
}

.avatar {
  width: 178px;
  height: 178px;
  display: block;
}
</style>
<template>
  <div class="app-container">
    <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
      <el-form-item label="所属类别">
        <el-select v-model="queryParams.typeId" placeholder="请选择所属类别">
          <el-option v-for="item in typeOptions" :key="item.id" :label="item.name" :value="item.id"
            :disabled="item.status == 1"></el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="设备名称" prop="deviceName">
        <el-input v-model="queryParams.deviceName" placeholder="请输入设备名称" clearable @keyup.enter.native="handleQuery" />
      </el-form-item>
      <el-form-item label="设备编码" prop="deviceCode">
        <el-input v-model="queryParams.deviceCode" placeholder="请输入设备编码" clearable @keyup.enter.native="handleQuery" />
      </el-form-item>
      <el-form-item>
        <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
      </el-form-item>
    </el-form>

    <el-row :gutter="10" class="mb8">
      <el-col :span="1.5">
        <el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd"
          v-hasPermi="['device:device:add']">新增</el-button>
      </el-col>
      <el-col :span="1.5">
        <el-button type="success" plain icon="el-icon-edit" size="mini" :disabled="single" @click="handleUpdate"
          v-hasPermi="['device:device:edit']">修改</el-button>
      </el-col>
      <el-col :span="1.5">
        <el-button type="danger" plain icon="el-icon-delete" size="mini" :disabled="multiple" @click="handleDelete"
          v-hasPermi="['device:device:remove']">删除</el-button>
      </el-col>
      <el-col :span="1.5">
        <el-button type="warning" plain icon="el-icon-download" size="mini" @click="handleExport"
          v-hasPermi="['device:device:export']">导出</el-button>
      </el-col>
      <el-col :span="1.5">
        <el-button type="warning" plain icon="el-icon-setting" size="mini" @click="handleBoard"
          v-hasPermi="['device:board:edit']">设置公共点</el-button>
      </el-col>
      <el-col :span="1.5">
        <el-button type="danger" plain icon="el-icon-setting" size="mini" @click="resetHardWareConfig"
          v-hasPermi="['device:device:edit']">重置硬件配置</el-button>
      </el-col>
      <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
    </el-row>

    <el-table v-loading="loading" :data="deviceList" @selection-change="handleSelectionChange">
      <el-table-column type="selection" width="55" align="center" />
      <el-table-column label="设备id" align="center" prop="id" v-if="false" />
      <el-table-column label="头像" align="center" prop="imageUrl">
        <template slot-scope="scope">
          <div>
            <el-avatar :src="scope.row.imageUrl"></el-avatar>
          </div>
        </template>
      </el-table-column>
      <el-table-column label="设备名称" align="center" prop="deviceName" />
      <el-table-column label="设备编码" align="center" prop="deviceCode" />
      <el-table-column label="设备类别" align="center" prop="typeName" />
      <!-- <el-table-column label="地址" align="center" prop="address" /> -->
      <el-table-column label="测量对象" align="center" prop="dxbh">
        <template slot-scope="scope">
          <dict-tag :options="dict.type.device_gather_obj" :value="scope.row.dxbh" />
        </template>
      </el-table-column>
      <el-table-column label="地址位号" align="center" prop="addressBitmap" />
      <el-table-column label="导通" align="center" prop="isDt">
        <template slot-scope="scope">
          <dict-tag :options="dict.type.device_isdt" :value="scope.row.isDt" />
        </template>
      </el-table-column>
      <el-table-column label="主测点" align="center" prop="masterCode" />
      <el-table-column label="从测点" align="center" prop="slaveCode" />
      <el-table-column label="频率" align="center" prop="frequency" />
      <el-table-column label="电流" align="center" prop="electricity" />
      <el-table-column label="地桩距" align="center" prop="dzj" />
      <el-table-column label="寄存器地址" align="center" prop="jcqdz" />
      <el-table-column label="显示对象" align="center" prop="xsdx">
        <template slot-scope="scope">
          <dict-tag :options="dict.type.device_show_obj" :value="scope.row.xsdx" />
        </template>
      </el-table-column>
      <el-table-column label="回流" align="center" prop="huiliu">
        <template slot-scope="scope">
          <dict-tag :options="dict.type.device_isdt" :value="scope.row.huiliu" />
        </template>
      </el-table-column>
      <el-table-column label="单位计算" align="center" prop="dwxsw">
        <template slot-scope="scope">
          <dict-tag :options="dict.type.device_isdt" :value="scope.row.dwxsw" />
        </template>
      </el-table-column>
      <el-table-column label="采集方式" align="center" prop="cjfs">
        <template slot-scope="scope">
          <dict-tag :options="dict.type.device_gather_cjfs" :value="scope.row.cjfs" />
        </template>
      </el-table-column>
      <el-table-column label="设备状态" align="center" prop="deviceStatus">
        <template slot-scope="scope">
          <dict-tag :options="dict.type.device_status" :value="scope.row.deviceStatus" />
        </template>
      </el-table-column>
      <el-table-column label="操作" align="center" class-name="small-padding fixed-width" style="width: 300px;">
        <template slot-scope="scope">
          <el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)"
            v-hasPermi="['device:device:edit']">修改</el-button>
          <el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)"
            v-hasPermi="['device:device:remove']">删除</el-button>
          <el-button size="mini" type="text" icon="el-icon-s-tools" v-if="scope.row.isDt == '1'"
            @click="handleAuthBoard(scope.row)" v-hasPermi="['device:board:edit']">设置转换板</el-button>
          <el-button size="mini" v-if="scope.row.isDt == '0'" type="text" icon="el-icon-s-tools"
            @click="handleMasterSlave(scope.row)" v-hasPermi="['device:board:edit']">设置主从测点</el-button>
          <el-button size="mini" type="text" icon="el-icon-circle-check" @click="handleAuthPoint(scope.row)"
            v-hasPermi="['device:device:remove']">分配测点</el-button>
          <el-button size="mini" type="text" icon="el-icon-user-solid" @click="handleTest(scope.row)"
            v-hasPermi="['device:device:query']">手动测试</el-button>
          <el-button size="mini" type="text" icon="el-icon-document" @click="handleData(scope.row)"
            v-hasPermi="['device:device:query']">历史数据</el-button>
        </template>
      </el-table-column>
    </el-table>

    <pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize"
      @pagination="getList" />

    <!-- 添加或修改【设备】对话框 -->
    <el-dialog :title="title" :visible.sync="open" width="700px" append-to-body>
      <el-form ref="form" :model="form" :rules="rules" label-width="80px">
        <el-row>
          <el-col :span="24">
            <el-form-item label="图片" prop="imageUrl">
              <el-upload class="avatar-uploader" action="/dev-api/device/image/profile/avatar" :show-file-list="false"
                :on-success="handleAvatarSuccess" :before-upload="beforeAvatarUpload">
                <img v-if="form.imageUrl" :src="options.img" class="avatar">
                <i v-else class="el-icon-plus avatar-uploader-icon"></i>
              </el-upload>
            </el-form-item>
          </el-col>

        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="设备类别">
              <el-select v-model="form.typeId" placeholder="请选择所属类别">
                <el-option v-for="item in typeOptions" :key="item.id" :label="item.name" :value="item.id"
                  :disabled="item.status == 1"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="设备名称" prop="deviceName">
              <el-input v-model="form.deviceName" placeholder="请输入设备名称" />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="设备编码" prop="deviceCode">
              <el-input v-model="form.deviceCode" placeholder="请输入设备编码" />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="测量对象" prop="dxbh">
              <el-select v-model="form.dxbh" placeholder="请选择测量对象">
                <el-option v-for="dict in dict.type.device_gather_obj" :key="dict.value" :label="dict.label"
                  :value="dict.value"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="频率(Hz)" prop="frequency">
              <el-input v-model="form.frequency" placeholder="请输入频率" />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="电流(A)" prop="electricity">
              <el-input v-model="form.electricity" placeholder="请输入电流" />
            </el-form-item>
          </el-col>
        </el-row>
        
        <el-row>
          <el-col :span="12">
            <el-form-item label="地桩距" prop="dzj">
              <el-input v-model="form.dzj"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="显示对象" prop="xsdx">
              <el-select v-model="form.xsdx" placeholder="请选择显示对象">
                <el-option v-for="dict in dict.type.device_show_obj" :key="dict.value" :label="dict.label"
                  :value="dict.value"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="寄存器位" prop="jcqdz">
              <el-input v-model="form.jcqdz"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="采集方式" prop="cjfs">
              <el-select v-model="form.cjfs" placeholder="请选择采集方式">
                <el-option v-for="dict in dict.type.device_gather_cjfs" :key="dict.value" :label="dict.label"
                  :value="dict.value"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        
        <el-row>
          <el-col :span="24">
            <el-form-item label="地址" prop="address">
              <el-input v-model="form.address" placeholder="请输入地址" />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="24">
            <el-form-item label="备注" prop="remark">
              <el-input v-model="form.remark" type="textarea" placeholder="请输入内容" />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="是否导通" prop="isDt">
              <el-radio-group v-model="form.isDt">
                <el-radio v-for="dict in dict.type.device_isdt" :key="dict.value" :label="dict.value">{{ dict.label
                }}</el-radio>
              </el-radio-group>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="状态" prop="status">
              <el-radio-group v-model="form.status">
                <el-radio v-for="dict in dict.type.sys_normal_disable" :key="dict.value" :label="dict.value">{{
                  dict.label
                }}</el-radio>
              </el-radio-group>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="是否回流" prop="huiliu">
              <el-radio-group v-model="form.huiliu">
                <el-radio v-for="dict in dict.type.device_isdt" :key="dict.value" :label="dict.value">{{ dict.label
                }}</el-radio>
              </el-radio-group>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="单位计算" prop="dwxsw">
              <el-radio-group v-model="form.dwxsw">
                <el-radio v-for="dict in dict.type.device_isdt" :key="dict.value" :label="dict.value">{{
                  dict.label
                }}</el-radio>
              </el-radio-group>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="submitForm">确 定</el-button>
        <el-button @click="cancel">取 消</el-button>
      </div>
    </el-dialog>

    <!--  设置点位  -->
    <el-dialog :title="titleBoard" :visible.sync="openBoard" width="700px" append-to-body>
      <div>
        <el-table border :data="boardRefList">
          <el-table-column label="板子号" align="center" prop="boardCode" width="60"></el-table-column>
          <el-table-column label="通道号" align="center" width="600">
            <template #default="scope">
              <el-checkbox-group v-model="scope.row.ischeckAll">
                <el-checkbox v-for="item in scope.row.interestList" :value="item.code" :label="item.name"
                  :key="keyzh(scope.row.boardCode, item.code)">{{ item.name }}</el-checkbox>
              </el-checkbox-group>
            </template>
          </el-table-column>
        </el-table>
      </div>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="submitFormBoard">确 定</el-button>
        <el-button @click="cancelBoard">取 消</el-button>
      </div>
    </el-dialog>
    <!--  设置主测点位  -->
    <el-dialog :title="titleMs" :visible.sync="openMs" width="700px" append-to-body>
      <el-form ref="formMs">
        <div>
          <el-form-item label="主测点">
            <el-table border :data="boardRefList1">
              <el-table-column label="板子号" align="center" prop="boardCode" width="60"></el-table-column>
              <el-table-column label="通道号" align="center" width="600">
                <template #default="scope">
                  <el-checkbox-group v-model="scope.row.ischeckAll">
                    <el-checkbox v-for="item in scope.row.interestList" :value="item.code" :label="item.name"
                      :key="keyzh(scope.row.boardCode, item.code)">{{ item.name }}</el-checkbox>
                  </el-checkbox-group>
                </template>
              </el-table-column>
            </el-table>
          </el-form-item>
        </div>
        <div>
          <el-form-item label="从测点">
            <el-table border :data="boardRefList1">
              <el-table-column label="板子号" align="center" prop="boardCode" width="60"></el-table-column>
              <el-table-column label="通道号" align="center" width="600">
                <template #default="scope">
                  <el-checkbox-group v-model="scope.row.ischeckSlave">
                    <el-checkbox v-for="item in scope.row.interestList" :value="item.code" :label="item.name"
                      :key="keyzh(scope.row.boardCode, item.code)">{{ item.name }}</el-checkbox>
                  </el-checkbox-group>
                </template>
              </el-table-column>
            </el-table>
          </el-form-item>
        </div>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="submitFormMs">确 定</el-button>
        <el-button @click="cancelMs">取 消</el-button>
      </div>
    </el-dialog>
    <!-- 历史数据 -->
    <el-dialog :title="titleData" :visible.sync="openData" width="850px" append-to-body>
      <el-table v-loading="loadingData" :data="deviceDataList">
        <el-table-column label="电阻" align="center" prop="dz" />
        <el-table-column label="电阻单位" align="center" prop="dzUnit" />
        <el-table-column label="电压" align="center" prop="dy" />
        <el-table-column label="电压单位" align="center" prop="dyUnit" />
        <el-table-column label="电流" align="center" prop="dl" />
        <el-table-column label="电流单位" align="center" prop="dlUnit" />
        <el-table-column label="频率" align="center" prop="pl" />
        <el-table-column label="频率单位" align="center" prop="plUnit" />
        <el-table-column label="采集时间" align="center" prop="tsString" width="180px" />
      </el-table>
      <pagination v-show="totalData > 0" :total="totalData" :page.sync="queryDataParams.pageNum"
        :limit.sync="queryDataParams.pageSize" @pagination="getListData" />
    </el-dialog>
  </div>
</template>

<script>
import { listDevice, getDevice, delDevice, addDevice, updateDevice, getDeviceTypes, listDeviceBoardRef, addDeviceBoardRef, getDeviceBoards, updateDeviceMs, testCommand, listDeviceData,resetHardWareConfig } from "@/api/device/device";
var ws = null;
export default {
  name: "Device",
  dicts: ['sys_normal_disable', 'device_status', 'device_jiexianduanzi', 'device_bomaqi', 'device_isdt', 'device_show_obj', 'device_gather_obj','device_gather_cjfs'],
  data() {
    return {
      // 遮罩层
      loading: true,
      loadingData: true,
      // 选中数组
      ids: [],
      names: [],
      // 非单个禁用
      single: true,
      // 非多个禁用
      multiple: true,
      // 显示搜索条件
      showSearch: true,
      // 总条数
      total: 0,
      totalData: 0,
      // 【设备】表格数据
      deviceList: [],
      deviceDataList: [],
      // 弹出层标题
      title: "",
      titleBoard: "",
      titleMs: "",
      titleData: "",
      // 是否显示弹出层
      open: false,
      openBoard: false,
      openMs: false,
      openData: false,
      // 查询参数
      queryParams: {
        pageNum: 1,
        pageSize: 10,
        deviceName: null,
        deviceCode: null,
        typeId: null,
      },
      queryDataParams: {
        pageNum: 1,
        pageSize: 10,
        deviceId: null,
      },
      typeOptions: [],
      // 表单参数
      form: {},
      formBoard: {},
      formMs: {},
      // 表单校验
      rules: {
        status: [
          { required: true, message: "状态不能为空", trigger: "change" }
        ],
        deviceName: [
          { required: true, message: "设备名称不能为空", trigger: "change" }
        ],
        // xsdx: [
        //   { required: true, message: "显示对象不能为空", trigger: "change" }
        // ],
        // dxbh: [
        //   { required: true, message: "测量编号不能为空", trigger: "change" }
        // ],
      },
      options: {
        img: "", //图片的地址
      },
      boardList: [],
      boardRefList: [],
      interestListArry: [],
      refDeviceId: null,
      boardRefList1: [],
      interestListArry1: [],
      wsUrl: '',
          // 采集方式映射对象 - 用于回显
      cjfsMap: {
            '1': '串口',
            '2': '监测仪'
      }
    };
  },
  created() {
    this.wsUrl = process.env.VUE_APP_WS_URL
    this.getList();
    this.loadTypes();
  },
  mounted() {
    this.wsClient();
  },
  methods: {
    /** 查询【设备】列表 */
    getList() {
      this.loading = true;
      listDevice(this.queryParams).then(response => {
        this.deviceList = response.rows;
        this.total = response.total;
        this.loading = false;
      });
    },

    loadTypes() {
      getDeviceTypes().then(response => {
        this.typeOptions = response.data;
      })
    },
    // 取消按钮
    cancel() {
      this.open = false;
      this.reset();
    },
    cancelBoard() {
      this.openBoard = false;
      this.resetBoard();
    },
    cancelMs() {
      this.openMs = false;
      this.resetMs();
    },
    cancelData() {
      this.openData = false;
      this.resetData();
    },
    // 表单重置
    reset() {
      this.form = {
        id: null,
        deviceName: null,
        deviceCode: null,
        typeId: null,
        imageUrl: null,
        address: null,
        frequency: null,
        electricity: null,
        status: "0",
        remark: null,
        dxbh: null,
        isDt: '1',
        dzj: null,
        xsdx: null,
        jcqdz: null,
        huiliu: null,
        dwxsw: null,
        cjfs: null,
      };
      this.options.img = "";
      this.resetForm("form");
    },
    resetBoard() {
      this.formBoard = {

      };
      this.resetForm("formBoard");
    },
    resetMs() {
      this.formMs = {

      };
      this.resetForm("formMs");
    },
    resetData() {
      this.formData = {

      };
      this.resetForm("formData");
    },
    /** 搜索按钮操作 */
    handleQuery() {
      this.queryParams.pageNum = 1;
      this.getList();
    },
    /** 重置按钮操作 */
    resetQuery() {
      this.queryParams.typeId = undefined;
      this.resetForm("queryForm");
      this.loadTypes();
      this.handleQuery();
    },
    // 多选框选中数据
    handleSelectionChange(selection) {
      this.ids = selection.map(item => item.id)
      this.names = selection.map(item => item.deviceName)
      this.single = selection.length !== 1
      this.multiple = !selection.length
    },
    /** 新增按钮操作 */
    handleAdd() {
      this.reset();
      getDeviceTypes().then(response => {
        this.typeOptions = response.data;
        this.open = true;
        this.title = "添加【设备】";
      })
    },
    /** 修改按钮操作 */
    handleUpdate(row) {
      this.reset();
      const id = row.id || this.ids
      getDeviceTypes().then(response => {
        this.typeOptions = response.data;
      })
      getDevice(id).then(response => {
        this.form = response.data;
        this.options.img = response.data.imageUrl;
        this.open = true;
        this.title = "修改【设备】";
      });
    },
    /** 提交按钮 */
    submitForm() {
      this.$refs["form"].validate(valid => {
        if (valid) {
          if (this.form.id != null) {
            updateDevice(this.form).then(response => {
              this.$modal.msgSuccess("修改成功");
              this.open = false;
              this.getList();
            });
          } else {
            addDevice(this.form).then(response => {
              this.$modal.msgSuccess("新增成功");
              this.open = false;
              this.getList();
            });
          }
        }
      });
    },
    /** 删除按钮操作 */
    handleDelete(row) {
      const ids = row.id || this.ids;
      const names = row.deviceName || this.names;
      this.$modal.confirm('是否确认删除【设备】编号为"' + names + '"的数据项？').then(function () {
        return delDevice(ids);
      }).then(() => {
        this.getList();
        this.$modal.msgSuccess("删除成功");
      }).catch(() => { });
    },
    /** 导出按钮操作 */
    handleExport() {
      this.download('device/device/export', {
        ...this.queryParams
      }, `device_${new Date().getTime()}.xlsx`)
    },
    handleAvatarSuccess(res, file) {
      if (res.imgUrl != undefined) {
        this.options.img = process.env.VUE_APP_BASE_API + res.imgUrl;
        this.form.imageUrl = process.env.VUE_APP_BASE_API + res.imgUrl;
      } else {
        this.$modal.msgError(res.msg);
      }
    },
    beforeAvatarUpload(file) {
      const isJPG = file.type === 'image/jpeg';
      const isLt2M = file.size / 1024 / 1024 < 10;

      if (!isJPG) {
        this.$message.error('上传头像图片只能是 JPG 格式!');
      }
      if (!isLt2M) {
        this.$message.error('上传头像图片大小不能超过 10MB!');
      }
      return isJPG && isLt2M;
    },
    // 更多操作触发
    handleCommand(command, row) {
      switch (command) {
        case "handleAuthPoint":
          this.handleAuthPoint(row);
          break;
        default:
          break;
      }
    },
    /** 分配设备类型操作 */
    handleAuthPoint: function (row) {
      const deviceId = row.id;
      this.$router.push("/device/device-auth-point/point/" + deviceId);
    },
    handleAuthBoard: function (row) {
      this.refDeviceId = row.id;
      listDeviceBoardRef(row.id, row.deviceName).then(response => {
        this.boardRefList = response.data;
      })
      this.openBoard = true;
      this.titleBoard = "分配转换板";
    },
    handleMasterSlave: function (row) {
      this.refDeviceId = row.id;
      getDeviceBoards(row.id).then(response => {
        this.boardRefList1 = response.data;
      })
      this.openMs = true;
      this.titleMs = "设置主从测试点";
    },
    keyzh(boardCode, passageCode) {
      return boardCode + passageCode;
    },
    /** 提交按钮 */
    submitFormBoard() {
      const addData = [];
      this.boardRefList.forEach(item => {
        if (item.ischeckAll.length > 0) {
          item.ischeckAll.forEach(checkData => {
            const addJson = {};
            addJson["deviceId"] = this.refDeviceId;
            addJson["boardCode"] = item.boardCode;
            addJson["passageCode"] = checkData;
            addData.push(addJson);
          })
        }
      });
      if (addData.length == 0) {
        const addJson = {};
        addJson["deviceId"] = this.refDeviceId;
        addData.push(addJson);
      }
      addDeviceBoardRef(addData).then(response => {
        this.$modal.msgSuccess("设置成功");
        this.openBoard = false;
        this.getList();
      });
    },
    handleBoard() {
      this.refDeviceId = 0;
      listDeviceBoardRef(0).then(response => {
        this.boardRefList = response.data;
      })
      this.openBoard = true;
      this.titleBoard = "设置公共点";
    },
    resetHardWareConfig() {
      resetHardWareConfig().then(response => {
        this.$modal.msgSuccess("重置成功");
      })
    },
    submitFormMs() {
      let masterCode = "";
      const slaveArray = [];
      let count = 0;
      for (let i = 0; i < this.boardRefList1.length; i++) {
        const item = this.boardRefList1[i];
        if (item.ischeckAll.length > 0) {
          masterCode = item.boardCode + item.ischeckAll[0];
        }
        if (item.ischeckSlave.length > 0) {
          for (let j = 0; j < item.ischeckSlave.length; j++) {
            const checkData = item.ischeckSlave[j];
            slaveArray[count] = item.boardCode + checkData;
            count++;
          }
        }
      }
      if (masterCode.length > 2) {
        this.$message.error("主测点只能选1个！");
        return;
      }
      if (count > 6) {
        this.$message.error("从测点最多选5个！");
        return;
      }
      const dataMs = {};
      dataMs["id"] = this.refDeviceId;
      dataMs["masterCode"] = masterCode;
      dataMs["slaveCode"] = slaveArray.join(',');
      updateDeviceMs(dataMs).then(response => {
        this.$modal.msgSuccess("设置成功");
        this.openMs = false;
        this.getList();
      });
    },
    handleTest: function (row) {
      testCommand(row.id).then(response => {
          this.$modal.msgSuccess("开始采集");
      });
    },
    wsClient() {
      var url = this.wsUrl + "/websocket/message/9999";
      ws = new WebSocket(url);
      ws.onopen = function (event) {
        console.log("已经打开连接");
      }
      ws.onmessage = ((event) => {
        var msg = event.data;
        if (msg.includes("vue_msg")) {
          var jsonMsg = JSON.parse(msg);
          this.$message({
            message: jsonMsg["vue_msg"],
            type: 'success'
          });
        } else {
           this.$message({
            message: msg,
            type: 'success'
          });
        }
      })
      ws.onclose = function (event) {
        console.log("已经关闭连接");
      }
    },
    handleData(row) {
      this.queryDataParams.deviceId = row.id;
      this.loadingData = true;
      listDeviceData(this.queryDataParams).then(response => {
        this.deviceDataList = response.rows;
        this.totalData = response.total;
        this.loadingData = false;
      });
      this.openData = true;
      this.titleData = row.deviceName + "历史数据";
    },
    getListData() {
      this.loadingData = true;
      listDeviceData(this.queryDataParams).then(response => {
        this.deviceDataList = response.rows;
        this.totalData = response.total;
        this.loadingData = false;
      });
    },
  }
};
</script>
